<template>
	<!-- 组织移出、组织移入新增  -->
	<view class="">
		<!-- <view  v-if="type=='M1020'">
			<dcustom bgColor="bg-gradual-purple" :isBack="true" :isArrow="true">
				<block slot="content">组织移出</block>
			</dcustom>
		</view>
		<view  v-if="type=='M1021'">
			<dcustom bgColor="bg-gradual-purple" :isBack="true" :isArrow="true">				
				<block slot="content">组织移入</block>
			</dcustom>
		</view> -->
		<view class="card-wrapper">
			<!-- 主表 -->
			<view class="radius shadow shadow-lg bg-white padding-sm light bg-blue">
				<view class="flex flex-wrap">
					<view class="basis-xs">
						
						单据编号
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.BILLNO }}
					</view>
				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						集团
					</view>
					<view class="basis-xl text-black">
						{{ mainOrder.GROUPNAME || '' }}
					</view>
				</view>
				<view v-if="type=='M1020'">
					
					<view class="flex flex-wrap margin-top">
						<view class="basis-xs">
							移出组织
						</view>
						<view class="basis-xl text-black">
							{{ mainOrder.ORGNAME || '' }}
						</view>
						
					</view>
					<view class="flex flex-wrap margin-top">
						
						<view class="basis-xs">移出仓库</view>
						<view class="basis-xl text-black">{{ mainOrder.STORENAME || '' }}</view>
					</view>
					<view class="flex flex-wrap margin-top">
						
						<view class="basis-xs">移位人</view> 
						<view class="basis-xl text-black">{{ mainOrder.MOVER || '' }}</view>
					</view>
				</view>
				<view v-if="type=='M1021'">
					
					<view class="flex flex-wrap margin-top">
						
						<view class="basis-xs">移出组织</view>
						<view class="basis-xl text-black">{{ mainOrder.ORGNAME || '' }}</view>
					</view>
					
					<view class="flex flex-wrap margin-top">
					
						<view class="basis-xs">移出仓库</view>
						<view class="basis-xl text-black">{{ mainOrder.STORENAME || '' }}</view>
					</view>
					<view class="flex flex-wrap margin-top">
					
						<view class="basis-xs">移入组织</view>
						<view class="basis-xl text-black">{{ mainOrder.INORGNAME || '' }}</view>
					</view>
					<view class="flex flex-wrap margin-top">
					
						<view class="basis-xs">移入仓库</view>
						<view class="basis-xl text-black">{{ mainOrder.INSTORENAME || '' }}</view>
					</view>
					<view class="flex flex-wrap margin-top">
						
						<view class="basis-xs">移入人</view> 
						<view class="basis-xl text-black">{{ mainOrder.MOVER || '' }}</view>
					</view>
				</view>
				
				<view class="flex flex-wrap margin-top ">
					<view class="basis-xs">
						备注:
					</view>
					<view class="basis-xl text-black solid-bottom" :class="isActiveNote? 'solid-bottom-blue' :'' ">
						<input @focus="activeNote" @blur="getNote" class="wc-input " type="text" value="" placeholder="请输入" />
					</view>
				</view>

				
			</view>
			<!-- 子表 -->

			<view class="radius shadow shadow-lg bg-white padding-sm margin-top sub-table" v-for="(item,index) in dataList" :key="index">
				<view class="flex flex-wrap">
					<view class="basis-xs">
						物资编号
					</view>
					<view class="basis-xl text-black">
						{{ item.PK_MATERIAL }}
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						物资名称
					</view>
					<view class="basis-xl text-black">
						{{ item.MATERIALNAME }}
					</view>

				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						规格型号
					</view>
					<view class="basis-xl text-black">
						{{ item.MATSPEC||'' }}
					</view>

				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						移出货位
					</view>
					<view class="basis-xl text-black">
						{{ item.STATIONNAME ||''}}
					</view>

				</view>
				<view class="flex flex-wrap margin-top line-height-30 ">
					<view class="basis-xs ">
						申请数量
					</view>
					<view class="basis-xl text-black">
						{{ item.APNUM }}
					</view>
					
				</view>
				<view class="flex flex-wrap margin-top line-height-30 ">
					<view class="basis-xs ">
						移出数量<span class="text-red">*</span>
					</view>
					
					<view class="basis-xl solid-bottom  sub-table-input">
						<input class="wc-input" v-model="item.NNUM" type="text" placeholder="请输入移出数量" />
					</view>
				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						物资条码
					</view>
					<view class="basis-xl text-black position-r solid-bottom" :class="isActiveStore? 'solid-bottom-blue' :'' ">
						
						<view  class="wc-input" style="width: 60%;">{{ item.BARCODE }}</view>
						<view class="basis-xs text-right position-a scan-btn " @tap="openScan('BARCODE',index)">
							<text class="cuIcon-scan text-xxl text-bold"></text>
						</view>
					</view>
				</view>
				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						计量单位
					</view>
					<view class="basis-xl text-black">
						{{ item.UNIT||'' }}
					</view>

				</view>

				<view class="flex flex-wrap margin-top">
					<view class="basis-xs">
						图片上传
					</view>
					<view class="basis-xl text-black solid-bottom">
						{{ item.INPHOTO||'' }}
					</view>
					<!-- <view class="detail-list-input ">
						<view class="uploads">
							
							<view class='upload-image-view'>
							
								<block v-for="(image,index) in imageList" :key="index">
									<view class='image-view'>
										<image :src="image" :data-src="image" @tap="previewImage"></image>
										<view class='del-btn' :data-index="index" @tap='deleteImage'>
											<view class='baicha'></view>
										</view>
									</view>
								</block>
								<view class='add-view' v-if="imageList.length < imageLength" @tap="chooseImage">
									
									<view class="cross">
										<view class="transverse-line"></view>
										<view class="vertical-line"></view>
									</view>
								</view>
							</view>
							
						</view>
					</view> -->
				</view>
			</view>


			<view class="">
				<button class="cu-btn block bg-blue margin-tb-sm lg" @click="submit">
					提交
				</button>
			</view>
		</view>

		<w-picker mode="dateTime" startYear="2000" endYear="2050" step="1" :defaultVal="[1,1,1,1,2,5]" :current="true"
		 @confirm="onConfirm" ref="dateTime" themeColor="#f00"></w-picker>

	</view>

</template>
<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'
	import wPicker from "@/components/w-picker/w-picker.vue";
	import api from '@/common/api.js';
	import utils from '@/common/util.js';
	// var graceChecker = require("../../common/graceChecker.js");
	let query = {
		"category": "ST_INAPPLY",
		"page": 1,
		"rows": "50",
		"sidx": "",
		"sord": "",
		"queryJson": {},
		"userId": "",
		"account": "admin"
	}
	let _self, dateTimekey, activeIndex, VMEMO, BILLFROM, ajaxUrl,activeType,type,INMOVER;
	var sourceType = [
		['camera'], //拍照
		['album'], //相册
		['camera', 'album'] //拍照或相册
	]
	var sizeType = [
		['compressed'], //压缩
		['original'], //原图
		['compressed', 'original'] //压缩或原图
	]
	export default {
		computed: mapState(['userInfo', 'baseUrl']),
		data() {
			return {
				bstype: '',
				type:'',
				mainOrder: {},
				list: [], //获取到的物资数据
				dataList: [],
				allData: [], //初始化全局变量
				isActiveNote: false,
				isActiveStore: false,
				mid: '',
				today: utils.getToDay(),
				dateTimekey: '',
				activeIndex: '',
				label01: '单号', // 主表的第一个label
				activeLineIndex: 0,
				BARCODE:''
			}
		},
		components: {
			wPicker
		},
		onLoad(p) {
			console.log(JSON.stringify(p));
			_self = this
			this.bstype = p.t;
			query.userId = _self.userInfo.UserId
			query.account = _self.userInfo.Account
			query.category = p.dbt;
			query.queryJson.BILLNO=p.id;
			
		/* 	console.log(p.item); */
			_self.type = p.type;
			let abc = JSON.parse(decodeURIComponent(p.item));
			
			_self.mainOrder = abc;
			ajaxUrl = api.apiPublic.DisplacementAdd;
			_self.getDetailItm();
			
		},
		onUnload(){
			uni.$off('getSelectItem',function(data){})
		},
		methods: {
			getNote(e) {
				VMEMO = e.target.value;
			},
			getNoteINMOVER(e){
				INMOVER = e.target.value;
			},
			onConfirm(val) {
				this.dataList[activeIndex][dateTimekey] = val.result;
			},
			dateEvent(id, index) {
				dateTimekey = id;
				activeIndex = index;
				this.$refs.dateTime.show();
			},
			activeNote() {
				_self.isActiveNote = true
			},
			activeNoteINMOVER(){
				_self.isActiveNote = true
			},
			activeIndexM(i,t){
				_self.activeLineIndex = i ; 
				if(i==5){return;}
				activeType = t ;
				uni.navigateTo({
					url:'../public/search?t='+t
				})
			},
			
		//选择图片
		chooseImage: async function() {
			uni.chooseImage({
		
				sourceType: sourceType[this.sourceTypeIndex],
				// #ifdef MP-WEIXIN
				sizeType: sizeType[this.sizeTypeIndex],
				// #endif
				count: this.imageLength - this.imageList.length,
				success: (res) => {
					console.log(_self.baseUrl);
					var _tempFiles = res.tempFiles[0];
					console.log(res.tempFiles[0].path)
					var _tempFile = res.tempFiles[0].path;
		
					console.log(_tempFiles);
					this.imageList = this.imageList.concat(res.tempFilePaths);
					//this.imageList = this.imageList.concat(res.tempFiles[0]);
					console.log(this.imageList);
					const tempFilePaths2 = res.tempFilePaths;
					debugger;
					//上传图片接口
					var imgUrl = _self.baseUrl + "/UploadFile/UploadifyFile";
		
					console.log(imgUrl);
					uni.uploadFile({
						url: imgUrl,
						filePath: _tempFile,
						name: 'file',
						header: {
							'content-type': 'multipart/form-data'
						},
		
						success: function(uploadFileRes) {
							_self.condations.INSTALLPHOTO = uploadFileRes.data;
						}
					});
		
				}
			})
		},
		dateChangeEnd(e) {
			this.condations.endDate = e.target.value;
		},
		//预览图片
		previewImage: function(e) {
			var current = e.target.dataset.src
			uni.previewImage({
				current: current,
				urls: this.imageList
			})
		},
		//删除图片
		deleteImage: function(e) {
			var index = e.target.dataset.index;
			var that = this;
			var images = that.imageList;
			images.splice(index, 1);
			that.imageList = images;
		},
		getDetailItm(){
			this.axios({
				url: api.apiPublic.getMaterList ,
				data: query ,
				isLoading: 1
			}).then(res=>{
				let { Result } = res ;
				let array = Result.rows.map((item)=>{
					item.APNUM = item.NNUM;
					item.NNUM = '';
					return item;
				})
				_self.dataList = array;
			})
		},
		openScan: function(e, index) {
			//扫码
			uni.scanCode({
					onlyFromCamera: true, //只能从相机
					success: function(res) {
						let codeValue = res.result;
						let codeUrl =  api.apiPublic.ScanCode;
						console.log(e);
						console.log(codeValue);
						 if (e == 'BARCODE') {
							this.axios({
								url: codeUrl ,
								data: { Code: codeValue } ,
								isLoading: 1
							}).then(res=>{
								let { Result } = res ;
								_self.BARCODE= Result.BARCODE;
								_self.dataList[index].BARCODE=Result.BARCODE || '8899';
							})
					}	
					console.log("获取二维码数据结束");
				}
			});
		console.log("相机加载结束");
		},
		submit() {
			let data={};
			console.log(_self.type);
			if(_self.type=='M1020'){
				data = {
					"BILLFROM":0,
					"BTCATEGORY":3,
					"MOVETYPE":0,
					"FRBILLNO": _self.mainOrder.BILLNO,
					"GROUPNAME": _self.mainOrder.GROUPNAME,
					"PK_GROUP": _self.mainOrder.PK_GROUP,				
					"PK_STORE": _self.mainOrder.PK_STORE, 
					"STORENAME": _self.mainOrder.STORENAME, 
					"PK_ORG": _self.mainOrder.PK_ORG,
					"ORGNAME": _self.mainOrder.ORGNAME,
					"MOVER": _self.mainOrder.MOVER,
					"PK_MOVER": _self.mainOrder.PK_MOVER,
					"INSTORENAME":_self.mainOrder.INSTORENAME,
					"PK_INSTORE":_self.mainOrder.PK_INSTORE, 
					"VMEMO": VMEMO,
					"BILLDATE":  utils.getToDay(),
					"BILLMAKER": _self.mainOrder.BILLMAKER,
					"userId": _self.userInfo.UserId,
					"account": _self.userInfo.Account,
					"Detail": JSON.stringify(_self.dataList)
				}
			}else if(_self.type=='M1021'){
				data = {
					"BTCATEGORY":3,
					"MOVETYPE":1,
					"FRBILLNO": _self.mainOrder.BILLNO,
					"GROUPNAME": _self.mainOrder.GROUPNAME,
					"PK_GROUP": _self.mainOrder.PK_GROUP,				
					"PK_STORE": _self.mainOrder.PK_STORE, 
					"STORENAME": _self.mainOrder.STORENAME, 
					"INSTORENAME":_self.mainOrder.INSTORENAME, 
					"PK_INSTORE":_self.mainOrder.PK_INSTORE, 
					"PK_ORG": _self.mainOrder.PK_ORG,
					"ORGNAME": _self.mainOrder.ORGNAME,
					"MOVER": _self.mainOrder.MOVER,
					"PK_MOVER": _self.mainOrder.PK_MOVER,
					"INMOVER": INMOVER,
					"BILLDATE":  utils.getToDay(),
					"BILLMAKER": _self.mainOrder.BILLMAKER,
					"VMEMO": VMEMO,
					"userId": _self.userInfo.UserId,
					"account": _self.userInfo.Account,
					"Detail": JSON.stringify(_self.dataList)
				}
			}
			 
		/* 	console.log(data) */
			let checkResult = false,error='';
			_self.dataList.forEach((item)=>{
				
				if(!item.NNUM){
					return error = '移出数量不能为空'
				}
				checkResult = true;
			})
			
			 if (!checkResult) {
				return uni.showToast({
					title: error,
					icon: "none"
				})
			}
			console.log(ajaxUrl)
			this.axios({
				url: ajaxUrl ,
				data: data ,
				isLoading: 1
			}).then(res=>{
				let { Result } = res ;
				this.$utils.tips('提交成功')
				utils.delayBack();
			})
		}
	}
	}
</script>

<style scoped>
	.card-wrapper {
		padding: 26upx;
	}

	.line-height-30 {
		line-height: 24px !important;
	}



	.sub-table-input {
		margin-top: 10upx;
	}
	.down-arrow-btn{
		top: -20upx;
		right: 0upx;
		font-size: 40upx;
		padding: 10upx;
	}
	.add-btn-wrap{
		position: fixed;
		bottom: 100upx;
		right: 50upx;
	}
	.add-btn-wrap .cuIcon-add{
		font-size: 50upx;
	}
</style>
